import React, {Component} from 'react';
import {observer} from 'mobx-react';
import { withRouter } from 'react-router-dom';
import { Tools } from 'weaver-mobile';
import isEmpty from 'lodash/isEmpty';

import SignData from './SignData';
import SignBtn from './SignBtn';

const getLabel = Tools.getLabel;

@withRouter
@observer
export default class Item extends Component {
    render(){
        const {data} = this.props;
        const {needSign, type, pre, across, time} = data;

        const showSignData = !isEmpty(needSign) && needSign != '1';

        let label = (type === 'on' ? `${getLabel('125809','上班时间')} ` : `${getLabel('125810','下班时间')} `);
        label += (pre === '1' ? getLabel('500501','昨日') : (across === '1' ? getLabel('388785','次日') : ''));
        label += time;

        return (
            <div className='sign-item'>
                <div onClick={() => this.props.history.push({pathname: '/mapSign'})}>{label}</div>
                {
                    showSignData ? <SignData {...this.props} /> : <SignBtn {...this.props} />
                }
            </div>
        )
    }
}